<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:include="common/admin/common::common_head">
    <title>管理员首页</title>
</head>
<style type="text/css">
    .panel-body a {
        text-decoration: none;
    }
</style>
<body class="cm-no-transition cm-1-navbar">
<!--后台公共侧边栏（菜单）-->
<div th:replace="common/admin/common::common_siderbar"></div>
<!--后台公共顶部-->
<div th:replace="common/admin/common::common_top"></div>
<div id="global">
    <div class="container-fluid cm-container-white">
        <h2 style="margin-top:0;">[[null ne ${session.admin} ? ${session.admin.name}]]，欢迎您来到主宰众人资金的直播现场！</h2>
    </div>
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-3 col-xs-6">
                <div class="panel panel-default">
                    <div class="panel-body" style="min-height: 200px">
                        <a th:href="@{/admin/user/list}">
                            <h1 class="text-center text-success"><b id="userCount"></b></h1>
                            <br>
                            <h3 class="text-center">
                                <img alt="notepad" th:src="@{/admin/assets/img/sf/profile.svg}">
                                <span>用户总数</span>
                            </h3>
                        </a>
                    </div>
                </div>
            </div>
            <div class="col-sm-3 col-xs-6">
                <div class="panel panel-default">
                    <div class="panel-body" style="min-height: 200px">
                        <a th:href="@{/admin/product/list}">
                            <h1 class="text-center text-success"><b id="productCount"></b></h1>
                            <br>
                            <h3 class="text-center">
                                <img alt="notepad" th:src="@{/admin/assets/img/sf/profile.svg}">
                                <span>项目总数</span>
                            </h3>
                        </a>
                    </div>
                </div>
            </div>
            <div class="col-sm-3 col-xs-6">
                <div class="panel panel-default">
                    <div class="panel-body" style="min-height: 200px">
                        <a th:href="|javascript:;|">
                            <h1 class="text-center text-success"><b id="investSum"></b></h1>
                            <br>
                            <h3 class="text-center">
                                <img alt="notepad" th:src="@{/admin/assets/img/sf/profile.svg}">
                                <span>交易总笔数</span>
                            </h3>
                        </a>
                    </div>
                </div>
            </div>
            <div class="col-sm-3 col-xs-6">
                <div class="panel panel-default">
                    <div class="panel-body" style="min-height: 200px">
                        <a th:href="|javascript:;|">
                            <h1 class="text-center text-success"><b id="investCount"></b></h1>
                            <br>
                            <h3 class="text-center">
                                <img alt="notepad" th:src="@{/admin/assets/img/sf/profile.svg}">
                                <span>投资总金额</span>
                            </h3>
                        </a>
                    </div>
                </div>
            </div>
        </div>
        <!--<div class="row cm-fix-height">
            <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                <a class="panel panel-default thumbnail cm-thumbnail" th:href="@{/dashboard-sales.html}">
                    <div class="panel-body text-center">
                        <span class="svg-48">
                            <img alt="dashboard" th:src="@{/admin/assets/img/sf/dashboard.svg}">
                        </span>
                        <h4>Dashboard</h4> <small>C3.js charts to display some fancy pies.</small>
                    </div>
                </a>
            </div>
            <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                <a class="panel panel-default thumbnail cm-thumbnail" th:href="@{/notepad.html}">
                    <div class="panel-body text-center">
                                <span class="svg-48">
                                    <img alt="notepad" th:src="@{/admin/assets/img/sf/notepad.svg}">
                                </span>
                        <h4>Text editor</h4> <small>Summernote WYSIWYG Editor implementation.</small>

                    </div>
                </a>
            </div>
            <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                <a class="panel panel-default thumbnail cm-thumbnail" th:href="@{/components-text.html}">
                    <div class="panel-body text-center">
                                <span class="svg-48">
                                    <img alt="brick" th:src="@{/admin/assets/img/sf/brick.svg}">
                                </span>
                        <h4>Components</h4> <small>Bootstrap main classes.</small>

                    </div>
                </a>
            </div>
            <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                <a class="panel panel-default thumbnail cm-thumbnail" th:href="@{/layouts-breadcrumb1.html}">
                    <div class="panel-body text-center">
                                <span class="svg-48">
                                    <img alt="window-layout" th:src="@{/admin/assets/img/sf/window-layout.svg}">
                                </span>
                        <h4>Navbar layouts</h4> <small>Put all you need on the top of your screen.</small>

                    </div>
                </a>
            </div>
            <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                <a class="panel panel-default thumbnail cm-thumbnail" th:href="@{/ico-sf.html}">
                    <div class="panel-body text-center">
                                <span class="svg-48">
                                    <img alt="cat" th:src="@{/admin/assets/img/sf/cat.svg}">
                                </span>
                        <h4>Icons</h4> <small>Semantic little pics.</small>

                    </div>
                </a>
            </div>
            <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                <a class="panel panel-default thumbnail cm-thumbnail" th:href="@{/login.html}">
                    <div class="panel-body text-center">
                                <span class="svg-48">
                                    <img alt="lock-open" th:src="@{/admin/assets/img/sf/lock-open.svg}">
                                </span>
                        <h4>Login page</h4> <small>Have a look to the login page.</small>

                    </div>
                </a>
            </div>
        </div>-->
        <div class="panel panel-default">
            <div class="panel-heading">Check our fancy colors</div>
            <div class="panel-body" id="demo-buttons">
                <p>Click buttons below to change navbar main color :</p>
                <div class="row">
                    <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                        <button class="btn btn-block btn-primary" data-switch-color="primary">primary</button>
                        <br>
                    </div>
                    <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                        <button class="btn btn-block btn-success" data-switch-color="success">success</button>
                        <br>
                    </div>
                    <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                        <button class="btn btn-block btn-info" data-switch-color="info">info</button>
                        <br>
                    </div>
                    <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                        <button class="btn btn-block btn-warning" data-switch-color="warning">warning</button>
                        <br>
                    </div>
                    <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                        <button class="btn btn-block btn-danger" data-switch-color="danger">danger</button>
                        <br>
                    </div>
                    <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                        <button class="btn btn-block btn-gray" data-switch-color="gray">gray</button>
                        <br>
                    </div>
                    <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                        <button class="btn btn-block btn-yellow" data-switch-color="yellow">yellow</button>
                        <br>
                    </div>
                    <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                        <button class="btn btn-block btn-purple" data-switch-color="purple">purple</button>
                        <br>
                    </div>
                    <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                        <button class="btn btn-block btn-turquoise" data-switch-color="turquoise">turquoise</button>
                        <br>
                    </div>
                    <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
                        <button class="btn btn-block btn-midnight" data-switch-color="midnight">midnight</button>
                        <br>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <footer th:replace="common/admin/common::common_footer"></footer>
</div>

<script th:replace="common/admin/common::common_footer_script"></script>
<script th:src="@{/admin/assets/js/demo/home.js}"></script>
<script type="text/javascript">
    document.title = '亿人宝 - 管理中心';

    // 首页数据显示
    function loadData() {
        let loadIndex = layer.load(0, {
            offset: ['50%', '50%']
        });
        $.getJSON('[[@{/admin/statisticsData}]]', {}, function (data) {
            layer.close(loadIndex);
            if (data.status == 200) {
                let result = data.obj;
                $('#userCount').text(result.userCount);
                $('#productCount').text(result.productCount);
                $('#investSum').text(result.investSum);
                $('#investCount').text(result.investCount);
            }
        })
    }

    $(function () {
        loadData();
    })
</script>
</body>
</html>
